
<label>多少热菜？</label>
<input id="recai" />
<br/>
<label>多少凉菜？</label>
<input id="liangcai" />
<br/>
<label>多少米饭？</label>
<input id="mifan" />
<br/>
<label>多少大窑？</label>
<input id="dayao" />
<br/>
<label>谁买单？</label>
<form>
    <input type="radio" name="maidanren" onclick="maidan(this.value)" value="17310236328 赵">赵宪泽<br>
    <input type="radio" name="maidanren" onclick="maidan(this.value)" value="18522151066 孟">孟凯<br>
    <input type="radio" name="maidanren" onclick="maidan(this.value)" value="18833481632 陈">陈旭光<br>
    <input type="radio" name="maidanren" onclick="maidan(this.value)" value="15332118310 薄">薄凯琪<br>
    <input type="radio" name="maidanren" onclick="maidan(this.value)" value="18302249005 韩">韩志伟<br>
    <input type="radio" name="maidanren" onclick="maidan(this.value)" value="13920618956 任">任毅<br>
    <input type="radio" name="maidanren" onclick="maidan(this.value)" value="15342036281 翟">翟继忠<br>
</form>
<br/>
<label>几点到？</label>
<input id="jidian" />
<br/>

<button id="diancai" onclick="dianla()">点菜</button>
<br/>

<p id="resultr"></p>

<script>
    const recai = ['绝味香酥小排','宫爆鸡丁','秘制烤鱼','新版京酱肉丝','重庆水煮鱼','干锅茶树菇','砂锅牛三鲜','家常蒸酥肉','清炒虾仁','干炸小酥肉','口袋饼烤羊肉','干锅千页豆腐','鲜椒金钱肚','干煸豆角','黄豆焖猪手','松仁玉米粒','干煸辣子鸡','白灼菜心','川味毛血旺','蒜蓉粉丝娃娃菜','特色酱炒鸡','香酥小河虾','干煸鱿鱼须','香炸黄花鱼','必点熏排骨','香炸带鱼段','辣椒炒肉','红烧鸡蛋豆腐','梅菜扣肉','炒合菜','醋溜木须','尖椒豆皮']
    const liangcai = ['津门水爆肚','五彩鸡丝大拉皮','绝味牛蹄子','双椒皮蛋','秘制牛腱子','自制Q弹皮冻','羊杂拼盘','水煮花生','脱骨凤爪','素什锦','凉拌猪耳朵','果仁菠菜','秘制回味肘花','老醋花生','独流焖酥鱼','蛰皮菜心','老醋六样','秘制豆腐丝','招牌大拌菜','津味','末三丝']
    
    const $recai = document.getElementById('recai')
    const $liangcai = document.getElementById('liangcai')
    const $resultr = document.getElementById('resultr')
    const $diancai = document.getElementById('diancai')

    function getRandomArrayElements(arr, count) {
        var shuffled = arr.slice(0), i = arr.length, min = i - count, temp, index;  //只是声明变量的方式, 也可以分开写
        while (i-- > min) {
            index = Math.floor((i + 1) * Math.random()); //这里的+1 是因为上面i--的操作  所以要加回来
            temp = shuffled[index];  //即值交换
            shuffled[index] = shuffled[i]; 
            shuffled[i] = temp;
        }
        return shuffled.slice(min);
    }
       
    let maidanren = ''

    function maidan(v) {
        maidanren = v
    }

     function dianla() {

        let recair = (getRandomArrayElements(recai, $recai.value))
        let recail = (getRandomArrayElements(liangcai, $liangcai.value))

        let huashu = 
        `
        ${recair.join('<br/>')}
        <br/>
        ${recail.join('<br/>')}
        <br/>
        ${document.getElementById('mifan').value}份米饭 ${document.getElementById('dayao').value}瓶大窑
        <br/>
        ${maidanren}
        <br/>
        ${document.getElementById('jidian').value}到店
        `
        $resultr.innerHTML = huashu;

    }
    
</script>